<!DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <script>
    // new Promise((resolve, rejected) => {  //执行器
    //   setTimeout(() => {
    //     resolve('成功执行的')  //状态已经变成了resolve的状态，且不可变
    //     rejected('失败执行的')
    //   }, 1000);
    // }).then(re => {
    //   console.log(re)
    // }).catch(err => {
    //   console.log(err)  //失败的回调函数
    // })

    // // 产生一个成功值为1 promise对象
    const n1 = new Promise((resolve, rejected) => {
      // 不写异步函数，直接调用 resolve的成功函数
      resolve(1)
    })

    // // es6的语法糖--Promise.resolve的简写形式
    // //===》等价于
    const n2 = Promise.resolve(2)
    // 取得n1的结果
    // n1.then(re => {
    //   console.log(re)   //1
    // })
    // // 取得n2的结果
    n2.then(re => {
      console.log(re)  //2
    })

    // //创建一个失败值为1的promise对象
    // Promise.reject(2).then(null, reason => { console.log(reason) })
    // //==>
    // Promise.reject(2).catch(reason => {
    //   console.log(reason)
    // })

    const n3 = Promise.reject(3)

    const pall = Promise.all([n1, n2, n3])   //返回一个promise的对象
    // pall.then(value => {
    //   console.log(value)    //全部成功方可以返回成功
    // })
    // pall.catch(err => {
    //   console.log(err)      //错误的原因为3
    // })

    pall.then((valaue) => {
      console.log(valaue)
    }).catch((error) => {
      console.log(error)
    })

    // const n4 = new Promise((resolve, rejected) => {
    //   throw new Error('出错了')   //改变状态为rejected
    // })

    // n4.then(null, err => {
    //   console.log(err)      //Error: 出错了
    // })

    // n4.catch(err => {
    //   console.log(err + '123')     //Error: 出错了123
    // })

    // promise对象，先改变的状态还是先指定的回调函数
    // new Promise(function (resolve, rejected) {
    //   setTimeout(() => {
    //     console.log(1)
    //     resolve(1)   //后将状态改变（在异步中）,指定参数并异步执行回调函数（then微任务）
    //   }, 100);
    // }).then(re => { console.log(re), err => { console.log(err) } })
    // // 回调函数  --先指定回调函数（promise会立刻返回），并保存回调函数

    // // 先改变状态，后指定回调函数
    // new Promise((resolve, rejected) => {
    //   resolve(1)   //同步回调函数
    // }).then(re => { console.log(re) }, err => { console.log(err) })
    // // 后指定回调函数并异步执行回调

    // // 先改变状态，后指定回调函数
    // const p = new Promise((resolve, rejected) => {
    //   setTimeout(() => {
    //     resolve(1)
    //   }, 100)
    // })

    // setTimeout(function () {
    //   p.then(re => { console.log(re) }, err => { console.log(err) })
    // })

    //new promise().then返回的新的promise的状态由什么来决定
    // 由then回调函数的执行结果决定

    // let p1 = new Promise((resolve, reject) => {
    //   resolve(1)
    // }).then((re) => {
    //   // throw new Error('报错')
    //   return new Promise((resolve, reject) => {
    //     resolve(2)
    //   })
    // }).then((val) => {
    //   console.log(val)
    // })


    // new Promise((resolve, rejected) => {
    //   resolve(1)
    //   // rejected(1)
    // }).then(
    //   value => {
    //     // console.log(value)
    //     // return 2   ==》Promise.resolve(2)
    //     // return Promise.resolve(3)
    //     // throw 5
    //     resolve(2)
    //   },
    //   reason => {
    //     console.log(reason)
    //   }
    // ).then(value => {
    //   console.log(value+'成功')
    // }, reason => {
    //   console.log(reason +'失败')
    // })

    // promise的链式调用
    // new Promise((resolve, rejected) => {
    //   setTimeout(() => {
    //     console.log(1)
    //     resolve(1)
    //   }, 1000)
    // }).then(
    //   value => {
    //     console.log('任务1的结果' + value)
    //     console.log('这个是同步的任务')
    //     return 2
    //   }
    // ).then(
    //   value => {
    //     console.log('任务2的结果' + value)
    //     // 异步的操作 同步直接return 异步返回新的promise方可以在后续继续使用链式的编程
    //     // setTimeout(() => {
    //     //   console.log(3)
    //     // })
    //     return new Promise((resolve, rejected) => {
    //       setTimeout(() => {
    //         console.log(3)
    //         resolve(3)   //状态改变方得以执行下面的
    //       }, 1000);
    //     })
    //   }
    // ).then(value => {
    //   console.log('任务3的结果' + value)
    // })

  </script>

</body>

</html>